<template>
	<view class="container">
		<image :src="imgUrl+info.image" mode="" class="image"></image>
		<view class="box">
			<view class="content">
				<view v-html="info.content"></view>
			</view>
		</view>
	</view>
</template>

<script>
	import { ggDetails } from '@/api/api.js'
	import config from '@/config'
	export default {
		data() {
			return {
				imgUrl:config.baseUrl,
				info:{},
			}
		},
		onLoad(options) {
			this.getDetails(options.id)
		},
		methods: {
			// 查看详情
			getDetails(id) {
				ggDetails(id).then((res) => {
					if(res.data){
						this.info = res.data
					}
				  })
			},
		}
	}
</script>

<style>
	.container{
		width: 100%;
	}
	
	.image{
		width: 100%;
		height: 340rpx;
	}
	
	.box{
		width: 95%;
		margin: 20rpx auto 0;
		font-weight: 300;
	}
	
	.box ul{
		padding: 20rpx;
		border: 1px solid #698376;
	}
	
	.box ul li{
		font-size: 24rpx;
		line-height: 45rpx;
	}
	
	.box ul li text{
		font-size: 28rpx;
		color: #698376;
		font-weight: 400;
	}
	
	.content{
		font-size: 26rpx;
		font-weight: 300;
		padding: 20rpx;
		margin-top: 20rpx;
		border: 1px solid #698376;
		background: #fff;
	}
	
	/* .title{
		font-size: 26rpx;
		color: #698376;
		font-weight: 400;
		margin: 20rpx 0 5rpx;
	} */
	
	.content{
		line-height: 43rpx;
	}
	
	.bot{
		display: flex;
		box-shadow: 1px 1px 10px #ddd;
		position: fixed;
		bottom: 0;
		left:0;
		width: 95%;
		padding: 20rpx;
	}
	
	.setPrice{
		margin-top: 10rpx;
		font-size: 34rpx;
	}
	
	.btn{
		margin-left: auto;
	}
	
	.btn button{
		width: 200rpx;
		font-size: 26rpx;
		border: 1px solid #698376;
		background-color: #fff;
		color: #698376;
	}
	
	.yjkt{
		padding: 10rpx 15rpx;
		font-size: 26rpx;
		border-radius: 10rpx;
		background-color: #ddd;
		color: #fff;
	}
</style>